<!--
    group: 发票管理
    item: 文字提示
-->
<template>
<div>
  <a-modal
    :width="config.width"
    :footer="null"
    :title="config.modalTitle"
    :destroyOnClose="true"
    v-model="config.visible"
  >
    <div class="main">
      <div :class="[config.icon ? 'flex' : '']">
        <a-icon v-if="config.icon" :type="config.icon" theme="filled" :style="{ color: config.iconColor, fontSize: config.iconSize + 'px', marginRight: 10 + 'px' }" />
        <div>
          <h5 class="title" v-if="config.title">{{ config.title }}</h5>
          <h6 class="subTitle" v-if="config.subTitle">{{ config.subTitle }}</h6>
          <p class="content" v-if="config.content">{{ config.content }}</p>
        </div>
      </div>

      <div class="footer_btns">
        <a-button
          v-if="config.okText"
          :type="config.okType"
          @click="sure"
        >{{ config.okText }}</a-button>
        <a-button
          class="mLeft"
          v-if="config.cancleText"
          :type="config.cancleType"
          @click="cancle"
        >{{ config.cancleText }}</a-button>
      </div>
    </div>
  </a-modal>
</div>
</template>

<script>
export default {
  name: 'modalCurrency',
  props:['config'],
  data(){
    return{
      // config: {
      //   width: '500px',  //modal宽度
      //   visible: false,    //modal展示状态
      //   modalTitle: '',   //modal层的标题
      //   icon: '',
      //   iconColor: '',
      //   iconSize: '',
      //
      //   title: '',     //标题
      //   subTitle: '',   //副标题
      //   content: '',  //内容
      //   okText: '确定',    //确定文字
      //   okType: 'primary',    //确定类型
      //   cancleText: '取消',    //取消文字
      //   cancleType: 'default',    //取消类型
      //
      //   source: '',    //来源
      //   cancleRoute: '',     //跳转路由
      // },

      //来源释义
      source: [
        {
          source: '',
          explain: '发送成功',
          hint: '发送成功！',
        },
        {
          source: 1,
          explain: '撤销并删除',
          hint: '撤销并删除发票信息后，已填写的内容将不会被保存，您确定撤销并删除吗？',
        },
        {
          source: 2,
          explain: '邀请验证',
          hint: '请提示法人收到短信后，及时完成验证！',
        },
        {
          source: 3,
          explain: '确认寄送（快递）',
          hint: '发票快递申请成功！我们将开始为您安排寄送，请您耐心等待！',
        },
        {
          source: 4,
          explain: '删除草稿',
          hint: '您确定删除该草稿吗？',
        },
        {
          source: 5,
          explain: '保存草稿成功',
          hint: '您可以在草稿箱查看或直接提交',
        },
        {
          source: 6,
          explain: '订单创建成功',
          hint: '订单创建成功！',
        },
        {
          source: 7,
          explain: '订单创建失败',
          hint: '原订单正在支付中，请完成原订单支付后再提交新订单',
        },
        {
          source: 8,
          explain: '订单创建失败',
          hint: '原订单可能已支付，请重新选择要结算的订单!',
        },
        {
          source: 9,
          explain: '结算存在未完成的票',
          hint: '您有尚未完成的开票任务，请优先完成“开票中”及“开票失败”状态的任务处理！',
        },
      ]
    }
  },
  methods:{
    //确定
    sure(){
      //子组件调用父组件方法
      // this.$parent.fatherMethod();
      this.$emit('fatherMethod',this.config);
    },
    //取消
    cancle(){
      this.config.visible = false;

      if (this.config.source == (6 || 7 || 8)){
        this.$parent.getTableData();
      }
      //支持跳转路由
      if (this.config.cancleRoute){
        this.$router.push({
          path: this.config.cancleRoute
        })
      }
    }
  }
}
</script>

<style scoped lang="less">
//
.flex{
  display: flex;
}


  .main{
    width: 100%;
    padding: 20px
  }
  .title{
    font-size: 18px;
    font-weight: bolder;
    color: #101010;
  }
  .subTitle{
    font-weight: bold;
    font-size: 16px;
    color: #101010;
  }
  .content{
    font-size: 15px;
    color: #333333;
  }
  .footer_btns{
    margin-top: 50px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }


  /deep/.ant-modal-title{
    font-size: 20px;
    text-align: left;
  }
</style>
